<template>
    <view class="container">
     <uni-forms :modelValue="formData" :rules="rules">
        <view class="from-item" @click="chooseImage">
            <uni-icons type="image-filled" size="30"></uni-icons>
            <button >上传图片</button>
            <!-- <image v-if="form.image" :src="form.image" class="preview-image"/> -->
        </view>
        <view class="from-item">
            <text>菜品名称：</text>
            <input type="text" name="name" placeholder="请输入菜品名称" />
        </view>

        <view class="from-item">
            <text>菜品描述：</text>
            <!-- <textarea v-fi v-model="form.description" placeholder="请输入描述"></textarea> -->
        </view>

        <view class="from-item">
            <text>配料：</text>
            <!-- <textarea v-model="form.ingredients" placeholder="请输入描述"></textarea> -->
        </view>

        <view class="from-item">
            <text>制作步骤：</text>
            <!-- <textarea v-model="form.steps" placeholder="请输入描述"></textarea> -->
        </view>
        <button form-type="submit"  @submit="submitFrom">保存菜品</button>
     </uni-forms>
    </view>
  </template>
  
  <script setup>
  const chooseImage = () => {    
    uni.chooseImage({
      count: 1,
      sizeType: ['original', 'compressed'],
      sourceType: ['album', 'camera'],
      success: function (res) {
        console.log(res.tempFilePaths)
      }
    })
  }  
  </script>
  
  <style>
.add-image {
    width: 160rpx;
    height: 160rpx;
}
  </style>
  